
<script>
/* eslint-disable */

import Node from "./Node";

export default {
  name: 'Sprite',

  mixins: [Node],

  props: {
    spriteProps:{type:Object,default:()=>{return {}}},
    spriteFrame:{type:Object},
  },
  watch: {
    "nodeComps":{
      handler(newv,oldv){
        // console.log("sprite watch nodeComps",newv,oldv);
        let oldComps = this.curComps;
        this.curComps = this.mergeComps(newv,this.spriteProps);
        this._updateNodeComps(this.ccnode,oldComps,this.curComps);
      }
    },
    "nodeProps":{
      handler(newv,oldv){
        // console.log("sprite watch nodeProps",newv,oldv);
        let oldProps = this.curProps;
        this.curProps = this.mergeProps(newv);
        this._updateNodeProps(this.ccnode,oldProps,this.curProps);
      }
    },
    "spriteProps":{
      handler(newv,oldv){
        // console.log("sprite watch spriteProps",newv,oldv);
        let oldComps = this.curComps;
        this.curComps = this.mergeComps(this.nodeComps,newv);
        this._updateNodeComps(this.ccnode,oldComps,this.curComps);
      }
    },
    "spriteFrame":{
      handler(newv,oldv){
        // console.log("sprite watch spriteFrame",newv,oldv);
        if(newv!=oldv){
          let oldComps = this.curComps;
          let oldProps = this.curProps;
          this.updateFrame(newv);
          this.curComps = this.mergeComps(this.nodeComps,this.spriteProps);
          this.curProps = this.mergeProps(this.nodeProps);
          this._updateNodeProps(this.ccnode,oldProps,this.curProps);
          this._updateNodeComps(this.ccnode,oldComps,this.curComps);
        }
      }
    },
  },

  created() {
    // console.log("sprite created",this.spriteprops,this.ccnode);
    this.createSprite();
  },

  // beforeUpdate(nv,ov){
  //   console.log("sprite beforeUpdate",nv,ov);
  // },

  // updated(nv,ov){
  //   console.log("sprite updated",nv,ov);
  // },

  // created(){
  //   console.log("node created",this);
  // },
  // mounted(){
  //   console.log("node mounted");
  // },

  methods: {
    //////////////////////////
    // 下面函数替换Node
    createNode() {},
    updateNodeProps(node,oldp,newp) {},
    updateNodeComps(node,oldp,newp) {},

    //////////////////////////
    // 
    updateFrame(spriteFrame){
      if(spriteFrame){
        this.curFrame = spriteFrame;
        return;
      }
      this.curFrame = null;
    },
    mergeProps(nodeProps){
      let sizeProps = {};
      if(this.curFrame){
        let rect = this.curFrame.getRect();
        sizeProps.width = rect.width;
        sizeProps.height = rect.height;
      }
      return {...sizeProps,...nodeProps};//{...nodeProps,...this.nodeSize};
    },
    mergeComps(nodeComps,spriteProps){
      let comps = [{
        type: cc.Sprite,
        props: {
          sizeMode: cc.Sprite.SizeMode.TRIMMED,
          spriteFrame: this.curFrame,
          ...spriteProps,
        }
      }];

      if(nodeComps){
        nodeComps.forEach(c => {
          if(c && c.type && c.type !== cc.Sprite){
            comps.push(c);
          }
        });
      }

      return comps;
    },
    createSprite() {
      if (!this.ccnode) {
        this.curFrame = null;

        this.updateFrame(this.spriteFrame);
        this.curComps = this.mergeComps(this.nodeComps,this.spriteProps);
        this.curProps = this.mergeProps(this.nodeProps);
        this._createNode(this.curProps,this.curComps);
      }
    },

    //   if(this.$props.frame){
    //     return this.$props.frame;
    //   }
    //   if(this.$props.texture){
    //     // if(this.spriteComponent&&)
    //     // if(this.$props.texture!==){
    //     // }
    //     return new cc.SpriteFrame(this.$props.texture);
    //   }

  },

}
</script>
